//          360 Degree Panorama Image Viewer (ADAPTED apwong 2/15/2011)
// **************************************************************************
// 			Written by Martin Krolik
// 			http://krolik.net
// 			martin@krolik.net
// **************************************************************************
// Original Cross Browser (NS4+,NS6+/Mozilla1+,IE4+,Safari1+) DHTML 360 Degree Panormic Image Javascript Viewer
// Version 3.2 
// Works by putting two of the same image adjacent.  A viewport scrolls throw the images
// as the images moves to compensate.
// vars below


var mytimer,xdist,ydist,xoffset,yoffset,xviewport,yviewport,defaulttravel,defaulttimeout,borderheight,borderwidth,bwidth,bheight,myobject,outerimgdiv,mypframe,myloadingdiv,myimage,mysecondimage,initialized,loaded,xoffsetwithinpic,yoffsetwithinpic,origimagewidth,origimageheight,maxtravel;
 
var imgNW,imgN,imgNE,imgW,imgE,imgSW,imgS,imgSE; 
 
// vars above
// ----------------------  Parameters below --------------------------------//
xoffset = 0;   
yoffset = 0;
xoffsetwithinpic = 0; // messes everything up... see note in code - not implemented 
yoffsetwithinpic = 0; // messes everything up... see note in code - not implemented
xviewport = 280;   // size of view window ... must be less than size of image
yviewport = 160;
defaulttravel = 3; // how many pixels at a time we move .... choppy'ness VS. slowness
defaulttimeout = 20; // how many milliseconds between moves
maxtravel = 8; // max number of pixels to move with mouse move event
borderheight = 25; // actually should be derived from NORTH or SOUTH BORDER image, but isn't
borderwidth = 25; // actualy should be derived from EAST or WEST BORDER image, but isn't
var dblZoom = 1.0;
// ----------------------  Parameters above --------------------------------//
// init code below - no modifications required
initialized = false;
loaded = false;
var pOldOnLoadPIV = null;
var pOldOnResizePIV = null;
if (window.onload != null) {
  pOldOnLoadPIV = window.onload;
}
if (window.onresize != null) {
  pOldOnResizePIV = window.onresize;
}


var mypreloadedimages=new Array()
function preloadimages()
{
	for (i=0;i<preloadimages.arguments.length;i++)
	{
		mypreloadedimages[i]=new Image();
		mypreloadedimages[i].src=preloadimages.arguments[i];
	}
}
preloadimages("panorama/images/ur-over.gif" , "panorama/images/u-over.gif" ,"panorama/images/ul-over.gif" ,"panorama/images/r-over.gif" , "panorama/images/l-over.gif" ,"panorama/images/br-over.gif" , "panorama/images/b-over.gif" , "panorama/images/bl-over.gif" );

var vstate = false;
var startx = 0;
var starty = 0;

function mdevent(objEvent)
{
  if (vstate == false) 
  {
    var oEvent = new xEvent(objEvent);
    quitmoving();
    xdist = 0;
    ydist = 0;
    startx = oEvent.pageX;
    starty = oEvent.pageY;
    vstate = true;
  }
}

function mmevent(objEvent)
{
  if (vstate) {
    var oEvent = new xEvent(objEvent);
    var xdelta, ydelta;
    xdelta = oEvent.pageX - startx;
    ydelta = oEvent.pageY - starty;
    if (xdelta > 0)
      {
      xdist = Math.round(Math.min(( xdelta / 2) , maxtravel));
      }
    else
      {
      xdist = Math.round(Math.max(( xdelta / 2) , 0-maxtravel));
      }
    if (ydelta > 0)
      {
      ydist = Math.round(Math.min(( ydelta / 2) , maxtravel));
      }
    else
      {
      ydist = Math.round(Math.max(( ydelta / 2) , 0-maxtravel));
      }
    /*
    // begin experimental mouse moving 2
    if (oEvent.pageX > startx)  { 
      xdist = defaulttravel;
    } else if (oEvent.pageX < startx)  { 
      xdist = 0 - defaulttravel;
    } else {  
      xdist = 0;
    }
    
    if (oEvent.pageY > starty)  { 
      ydist = defaulttravel;
    } else if (oEvent.pageY < starty) { 
      ydist = 0 - defaulttravel;
    } else {
      ydist = 0;
    }
    end experimental mouse moving 2 */
    shiftover(); 
  }
}

function muevent(objEvent)
{
  if (vstate) 
  {
    var oEvent = new xEvent(objEvent);
    // begin experimental mouse moving 3
    //xdist = Math.round(Math.min(( (oEvent.pageX - startx) / 2) , 50));
    //ydist = Math.round(Math.min(( (oEvent.pageY - starty) / 2) , 50));
    //shiftover(); 
    // end experimental mouse moving 3
    vstate = false;
  }
}

function zoomReset()
{
    if (!loaded) return;
    if (document.layers)
    {
      alert('The Zoom feature is not supported in Netscape 4.');
      return;
    }
    var nheight = origimageheight;
    var nwidth = origimagewidth;
    var left = xLeft(myobject);
    var top = xTop(myobject);
    var nl = left;
    var nt = top;
    if (nt < 0 - nheight + yviewport)
    {
      nt = 0 - nheight + yviewport ;
    }
    if (nt > 0)
    {
      nt = 0;
    }
    if (nl > 0)
    {
      nl = 0;
    }

    xWidth(myimage, origimagewidth);
    xHeight(myimage, origimageheight);	
 
    xWidth(mysecondimage, origimagewidth);
    xHeight(mysecondimage, origimageheight);

    xLeft(myobject, nl);
    xTop(myobject, nt);
    shiftover();
}

function zoomIn()
{
    if (!loaded) return;
    if (document.layers)
    {
      alert('The Zoom feature is not supported in Netscape 4.');
      return;
    }
    dblZoom = 1.2; // Zoom Out Percentage
    var nwidth = Math.round(dblZoom * xWidth(myimage)) ;
    var nheight = Math.round(dblZoom * xHeight(myimage)) ;
    xWidth(myimage, nwidth);
    xHeight(myimage, nheight);	
 
    xWidth(mysecondimage, nwidth );
    xHeight(mysecondimage, nheight );

    var left = xLeft(myobject);
    var top = xTop(myobject);
    var nl = dblZoom * (left - (0.5 * xviewport)) + (0.5 * xviewport) ;
    var nt = dblZoom * (top - (0.5 * yviewport)) + (0.5 * yviewport) ;
    xLeft(myobject, nl);
    xTop(myobject, nt);
    if (document.layers)
    {
      xClip(myobject,null, xviewport - xLeft(myobject) ,null,null);
    }
    shiftover();
    return;
}
function zoomOut()
{
    if (!loaded) return;
    if (document.layers)
    {
      alert('The Zoom feature is not supported in Netscape 4.');
      return;
    }
    dblZoom = 0.8;  // Zoom Out Percentage
    var nwidth = Math.round(dblZoom * xWidth(myimage)) ;
    var nheight = Math.round(dblZoom * xHeight(myimage)) ;
    if (( xviewport < nwidth ) && ( yviewport < nheight ) )
    {
      var left = xLeft(myobject);
      var top = xTop(myobject);
      var nl = dblZoom * (left - (0.5 * xviewport)) + (0.5 * xviewport) ;
      var nt = dblZoom * (top - (0.5 * yviewport)) + (0.5 * yviewport) ;  
      if (nt < 0 - nheight + yviewport)
      {
        nt = 0 - nheight + yviewport ;
      }
      if (nt > 0)
      {
        nt = 0;
      }
      if (nl > 0)
      {
        nl = 0;
      }


      xWidth(myimage, nwidth);
      xHeight(myimage, nheight);	
 
      xWidth(mysecondimage, nwidth);
      xHeight(mysecondimage, nheight);

      xLeft(myobject, nl);
      xTop(myobject, nt);
      if (document.layers)
      {
        xClip(myobject,null, xviewport - xLeft(myobject) ,null,null);
      }
    }
    shiftover();  
    return;
}

function initpiv() 
{
  myobject = xGetElementById("dimg");
  outerimgdiv = xGetElementById("dimgOuter");
  mypframe = xGetElementById("mypicframe");
  myloadingdiv = xGetElementById("nowloading");
  myimage = xGetElementById("ione");
 
  mysecondimage = xGetElementById("itwo");
 
 
  imgNW = xGetElementById("borderNW");
  imgN = xGetElementById("borderN");
  imgNE = xGetElementById("borderNE");
  imgW = xGetElementById("borderW");
  imgE = xGetElementById("borderE");
  imgSW = xGetElementById("borderSW");
  imgS = xGetElementById("borderS");
  imgSE = xGetElementById("borderSE");
 
  
   
  if (document.layers)
  {
    xAddEventListener(document, "mousedown", mdevent, true);
    xAddEventListener(document, "mousemove", mmevent, true);
    xAddEventListener(document, "mouseup", muevent, true); 
  } else {
  if (mypframe)
  {
    xAddEventListener(mypframe, "mousedown", mdevent, true);
    xAddEventListener(mypframe, "mousemove", mmevent, true);
    xAddEventListener(mypframe, "mouseup", muevent, true);
  }
  if (outerimgdiv)
  {
    xAddEventListener(outerimgdiv, "mousedown", mdevent, true);
    xAddEventListener(outerimgdiv, "mousemove", mmevent, true);
    xAddEventListener(outerimgdiv, "mouseup", muevent, true);
  }
  if (myobject)
  {
    xAddEventListener(myobject, "mousedown", mdevent, true);
    xAddEventListener(myobject, "mousemove", mmevent, true);
    xAddEventListener(myobject, "mouseup", muevent, true);
  }
  if (myimage)
  {
    xAddEventListener(myimage, "mousedown", mdevent, true);
    xAddEventListener(myimage, "mousemove", mmevent, true);
    xAddEventListener(myimage, "mouseup", muevent, true);
  }
  if (mysecondimage)
  {
    xAddEventListener(mysecondimage, "mousedown", mdevent, true);
    xAddEventListener(mysecondimage, "mousemove", mmevent, true);
    xAddEventListener(mysecondimage, "mouseup", muevent, true);
  }
  } // no document.layers
 
  origimagewidth = xWidth(myimage);
  origimageheight = xHeight(myimage); 
  loaded = true;
  positionpiv();
  if (pOldOnLoadPIV != null) {
    pOldOnLoadPIV();
  }	
}

function positionpiv()
{
  xoffset = xPageX('PlaceHolderDiv');
  yoffset = xPageY('PlaceHolderDiv');
  if (loaded) 
  {
    xMoveTo(outerimgdiv,xoffset,yoffset);
    xMoveTo(mypframe,xoffset-borderwidth,yoffset-borderheight+1);
  }
  xHide(myloadingdiv);
  xClip(myloadingdiv,0,0,0,0);
  xShow(outerimgdiv);
  xShow(myobject);
  xShow(mypframe);
  xClip(mypframe,0,(xviewport+borderwidth+borderwidth),(yviewport+borderheight+borderheight),0);
  xClip(mypframe,0,(xviewport+borderwidth+borderwidth),(yviewport+borderheight+borderheight),0);
		
  // lines below seem to add wierd blank pixel lines to top and bottom
  // of scroll in ie5
  xdist = xoffsetwithinpic;
  ydist = yoffsetwithinpic;

  shiftover();
  quitmoving();
  xdist=1;
  ydist=0;
  shiftover();  
  if (pOldOnResizePIV != null) {
    pOldOnResizePIV();
  }	

}
	
function shiftover()
{
 if (loaded) 
 {
  quitmoving();
  if ( ((xTop(myobject) - ydist ) >= 0) && (ydist<0) ) 
  {
    ydist = 0; 
  } else
  if ( ((xTop(myobject) - ydist ) <= ( yviewport - xHeight(myimage) ) ) && (ydist>0) ) 
  {
    ydist = 0; 
  }

  xMoveTo(myobject, xLeft(myobject) - xdist, xTop(myobject) - ydist);
 
  if (xLeft(myobject) > 0 )
  {
    xLeft(myobject, 0 - xWidth(myimage));
  } else 
  if (xLeft(myobject) < (0 - xWidth(myimage) ) ) 
  {
    xLeft(myobject, 0);
  } 

  if (document.layers)
  {
  	xClip(myobject,null, xviewport - xLeft(myobject) ,null,null);
  }
  initialized == true;
  if ((xdist != 0) || (ydist != 0))
  {
    mytimer = setTimeout("shiftover()",defaulttimeout);
  }
 }
}
function quitmoving() 
{
  if (mytimer)
  {
    clearTimeout(mytimer);
  }
  if (quitmoving.arguments.length > 0)
  {
    var blnClearDist = quitmoving.arguments[0];
    if (blnClearDist == true)
    {
      xdist = 0;
      ydist = 0;
    }
  }
}

function SwapImage(vImageName, vImageSrc)
{
  var objImg = xGetElementById(vImageName);
  if (objImg)
  {
    if (objImg.src)
    {
      objImg.src = vImageSrc;
    }
  }
}

function move_NW() {
  xdist=-defaulttravel;
  ydist=-defaulttravel;
  shiftover();
}

function move_N() {
  xdist=0;
  ydist=-defaulttravel;
  shiftover();
}

function move_NE() {
  xdist=defaulttravel;
  ydist=-defaulttravel;
  shiftover();
}

function move_W() {
  xdist=-defaulttravel;
  ydist=0;
  shiftover();
}

function move_E() {
  xdist=defaulttravel;
  ydist=0;
  shiftover();
}

function move_SW() {
  xdist=-defaulttravel;
  ydist=defaulttravel;
  shiftover();
}

function move_S() {
  xdist=0;
  ydist=defaulttravel;
  shiftover();
}

function move_SE() {
  xdist=defaulttravel;
  ydist=defaulttravel;
  shiftover();
}

xMoveTo(myloadingdiv, xLeft('PlaceHolderDiv'), xTop('PlaceHolderDiv'));

window.onload=initpiv;
window.onresize=positionpiv;


// my blah blah blah

$(document).ready(function(){

// Position Variables
var x = 0;
var y = 0;
 
// Speed - Velocity
var vx = 0;
var vy = 0;
 
// Acceleration
var ax = 0;
var ay = 0;
 
var delay = 10;
//var vMultiplier = 0.01;
 
if (window.DeviceMotionEvent==undefined) {
	//document.getElementById("no").style.display="block";
	//document.getElementById("yes").style.display="none";
 
} else {
	window.ondevicemotion = function(event) {
		ax = event.accelerationIncludingGravity.x;
		ay = event.accelerationIncludingGravity.y;
		document.getElementById("accelerationX").innerHTML = event.accelerationIncludingGravity.x;
		document.getElementById("accelerationY").innerHTML = event.accelerationIncludingGravity.y;
		document.getElementById("accelerationZ").innerHTML = event.accelerationIncludingGravity.z;
		quitmoving();
		
		if ( event.rotationRate ) {
			document.getElementById("rotationAlpha").innerHTML = event.rotationRate.alpha;
			document.getElementById("rotationBeta").innerHTML = event.rotationRate.beta;
			document.getElementById("rotationGamma").innerHTML = event.rotationRate.gamma;
		}	
 
	}
 
	setInterval(function() {
		/*var landscapeOrientation = window.innerWidth/window.innerHeight > 1;
		if ( landscapeOrientation) {
			vx = vx + ay;
			vy = vy + ax;
		} else {
			vy = vy - ay;
			vx = vx + ax;
		}
		vx = vx * 0.98;
		vy = vy * 0.98;
		y = parseInt(y + vy / 50);
		x = parseInt(x + vx / 50);*/
		
		/*to do: timings a bit weird*/
		
		if (ax<-2) { move_W(); }
		if (ax>2) { move_E(); }
		if (ax>-2 && ax<2) { quitmoving(); }
		
		if (ay<-2) { move_N(); }
		if (ay>2) { move_S(); }
		if (ay>-2 && ay<2) { quitmoving(); } 
		
		
		/*to do: coordinates flipped, issues in landscape*/
		if ( landscapeOrientation) {
		}
		
	}, delay);
} 

		

});

